<template>
   <section style="height:100%;">
     <van-nav-bar title="选择货品" fixed
        @click-left="onClickLeft"
        @click-right="onClickRight">
          <van-icon name="arrow-left" slot="left" color="#333" size="0.6rem"/>
          <van-icon :name="require('@/assets/img/computer.png')" slot="right" color="#333" size="0.6rem"/>
      </van-nav-bar>
      <div class="container" style="height:100%;">
        <div class="sub">
          <van-cell title="桌子" size="large" center v-for="index in 8" :key="index">
            <div slot="right-icon" class="cell-right-icon">
              <van-icon
              name="plus"
              style="line-height: inherit;"
            />
            </div>
          </van-cell>
        </div>
      </div>

      <div class="other-goods">
        <span>其他</span>
        <span>货物</span>
      </div>

      <div class="footer">
        <div class="footer-btn">
          确定
        </div>
      </div>
   </section>
</template>

<script>
export default {
  data() {
    return {

    };
  },
  mounted() {

  },
  watch: {

  },
  methods: {
    onClickLeft() {
      this.$router.back();
    },
    onClickRight () {
       let url = window.location.host; 
       
      let index = url.indexOf("pre");

     if (index<=-1) {
          window.location.href ="https://ka.lecarlink.com/index.aspx";    
      } else {
          window.location.href = "https://ka-pre.lecarlink.com/index.aspx";
      }
    }
  },
  components: {

  }
};
</script>

<style scoped lang='scss'>
.container{
  background: #F8F8F8;
  padding: 56px 15px 74px 15px;
  font-size: 16px;
  .sub{
    background: #FFFFFF;
    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.10);
    border-radius: 4px;
    .cell-right-icon{
      padding: 0 6px;
      box-sizing: content-box;
      border: 1px solid #ccc;
    }
  }
}

.other-goods{
  position: fixed;
  bottom: 80px;
  right: 10px;
  width: 80px;
  height: 80px;
  text-align: center;
  background: #F18D00;
  color: #fff;
  font-size: 18px;
  border-radius: 50%;
  display: flex;
  flex-flow: column;
  justify-content: center;
  align-items: center;
}
.footer{
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  background: #fff;
  height: 64px;
  .footer-btn{
    background: #F18D00;
    border-radius: 4px;
    height: 44px;
    line-height: 44px;
    margin: 10px 15px;
    font-size: 18px;
    text-align: center;
    color: #fff;
  }
}
</style>
